import 'package:flutter/material.dart';
import 'package:flutter_demo/demo/counter_view_model.dart';
import 'package:flutter_demo/demo/user_info.dart';
import 'package:flutter_demo/demo/user_info_model.dart';
import 'package:provider/provider.dart';

/// 1. 创建自己需要共享的数据
/// 2. 在应用顶层创建 ChangeNotifierProvider
/// 3. 在其他位置使用，两种使用方法
///   > Provider.of 数据发生改变时 所在的 build 方法都需要重新调用
///   > Consumer 数据发生改变时 只有 consumer 中的 build 方法重新调用，这里要注意可以把child提取出来
///   > Selector
///       selector方法可以对数据进行转换
///       shouldRebuild 方法可以确定是否需要重新构建
///   Consumer 和 Selector 可根据情况来选择
void main() => runApp(MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) => CounterViewModel()),
        ChangeNotifierProvider(
            create: (context) =>
                UserInfoModel(UserInfo(username: "admin", nickname: "张三", age: 30))),
      ],
      child: const MyApp(),
    ));

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("Provider")),
        body: Center(
          child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
            ShowData1(),
            ShowData2(),
            ShowData3(),
          ]),
        ),
        floatingActionButton: Selector<CounterViewModel, CounterViewModel>(
          selector: (context, counterVM) {
            return counterVM;
          },
          shouldRebuild: (pre, next) => pre.counter != next.counter,
          builder: (context, counterVM, child) {
            return FloatingActionButton(
                child: child,
                onPressed: () {
                  counterVM.counter += 1;
                });
          },
          child: Icon(Icons.add),
        ),
      ),
    );
  }
}

class ShowData1 extends StatelessWidget {
  const ShowData1({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    int counter = Provider.of<CounterViewModel>(context).counter;
    return Card(
        color: Colors.blue,
        child: Text(
          "当前计数：$counter",
          style: TextStyle(fontSize: 30),
        ));
  }
}

class ShowData2 extends StatelessWidget {
  const ShowData2({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Card(
      color: Colors.redAccent,
      child: Consumer<CounterViewModel>(builder: (BuildContext context, counterVM, Widget? child) {
        return Text(
          "当前计数：${counterVM.counter}",
          style: TextStyle(fontSize: 30),
        );
      }),
    );
  }
}

class ShowData3 extends StatelessWidget {
  const ShowData3({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Card(
      color: Colors.green,
      child: Consumer<UserInfoModel>(builder: (BuildContext context, model, Widget? child) {
        return Text(
          "昵称：${model.userInfo.nickname}，年龄：${model.userInfo.age}",
          style: TextStyle(fontSize: 30),
        );
      }),
    );
  }
}
